<style>
    .select2-container--open {
        z-index: 99999999;
    }
</style>
<div class="col-xs-16">
    <div class="nav-tabs-custom">
        <ul class="nav nav-tabs">
            <li class="active"><a href="#setting_5_1" data-toggle="tab">代金卷设置</a></li>
            <li><a id="djj_tab" {$sys['is_send_voucher']==2?'href="javascript:void(0)" style="cursor: no-drop;color:#a7a7a7;"':'href="#setting_5_2" data-toggle="tab"'}>新用户送券配置</a></li>
        </ul>
        <div class="tab-content">
            <div class="tab-pane active" id="setting_5_1">
                <form role="form" onsubmit="return sub_setting_5()">
                    <div class="box-body">
                        <div class="form-group">
                            <label>是否启用代金卷</label>
                            <input type="checkbox" id="use_voucher" class="on-off-button" data-size="mini" data-label-width="0" data-off-text="不启用" data-on-text="启用" data-handle-width="40" {$sys['use_voucher']==1?'checked':''}>
                            <font color="#AE1F00">(修改后下一轮下单时开始生效)</font>
                        </div>
                        <div class="form-group">
                            <label>新用户注册是否赠送代金劵</label>
                            <input type="checkbox" id="is_send_voucher" class="on-off-button" data-size="mini" data-label-width="0" data-off-text="不赠送" data-on-text="赠送" data-handle-width="40" {$sys['is_send_voucher']==1?'checked':''}>
                        </div>
                        <div class="form-group">

                            <div class="box-body table-responsive no-padding">
                                <table class="table table-striped table-hover">
                                    <tbody>
                                        <th>代金劵名称</th>
                                        <th>使用方法</th>
                                        <th>操作</th>
                                        <volist name="voucher_type_list" id="voucher_type">
                                            <tr>
                                                <td>{$voucher_type.name}</td>
                                                <td>
                                                    <if condition="$voucher_type.type eq 1">
                                                        直接使用
                                                        <else/>
                                                        单注金额达到{$voucher_type['use_money']|sprintf='%.2f',###}元才能使用
                                                    </if>
                                                </td>
                                                <td>
                                                    <span class="label label-primary" style="cursor:pointer;margin-right:3px;" onclick="edit_voucher_type_data('{$voucher_type.id}');">修改</span>
                                                </td>
                                            </tr>
                                        </volist>
                                    </tbody>
                                </table>
                            </div>

                        </div>
                    </div>
                    <!-- /.box-body -->

                    <div class="box-footer">
                        <button type="submit" class="btn btn-primary">保存</button>
                    </div>
                </form>
            </div>

            <div class="tab-pane" id="setting_5_2">
                <div class="box">
                    <div class="box-header" style="height:30px;">
                        <div class="box-tools">
                            <div class="input-group input-group-sm">
                                <button type="button" id="daer_djj_setting_btn" class="btn btn-info btn-xs"><i class="fa fa-plus"></i><span style="margin-left:5px;">添加配置</span></button>
                            </div>
                        </div>
                    </div>

                    <div class="box-body table-responsive no-padding">
                        <table class="table table-striped table-hover">
                            <tbody id="row_djj_data">
                            </tbody>
                        </table>
                    </div>
                    <!-- /.box-body -->
                    <div class="box-footer clearfix">
                        <div id="info_voucher_data" class="col-sm-5" style="top:5px;"><div class="dataTables_info" id="example1_info" role="status" aria-live="polite"></div></div>
                        <div class="col-sm-7">
                            <input type="hidden" value="__PAGESIZE__" id="page_size_voucher_config"/>
                            <input type="hidden" value="1" id="page_num_voucher_config"/>
                            <ul id="paging_voucher" class="pagination pagination-sm no-margin pull-right"></ul>
                        </div>
                    </div>
                    <div class="overlay hidden">
                        <i class="fa fa-refresh fa-spin"></i>
                    </div>
                </div>
            </div>

        </div>
        <!-- /.tab-content -->
    </div>
    <!-- /.nav-tabs-custom -->
</div>

<div id="win_voucher_temp" style="padding:20px;display:none;">
    <form id="daer_voucher_from" onsubmit="return false">
        <input type="hidden" name="id" id="id">
        <div class="form-group">
            <label for="voucher_range">代金券使用范围（不选默认为全场）</label>
            <select id="voucher_range" name="voucher_range" class="form-control select2 select2-hidden-accessible" style="width:100%;" tabindex="-1" aria-hidden="false" multiple="multiple">
                <volist name="games" id="game">
                    <option value="{$game.id}">{$game.game_name}</option>
                </volist>
            </select>
        </div>
        <div class="form-group">
            <label for="end_price">代金券面额</label>
            <div class="input-group">
                <input type="text" style="ime-mode:disabled;" onpaste="return false;" onkeypress="keyPress()" class="form-control" name="money" value="20" id="money" placeholder="代金券面额">
                <span class="input-group-addon">.00</span>
            </div>
        </div>
        <div class="form-group">
            <label for="type">代金券类型</label>
            <select id="type" name="type" class="form-control select2 select2-hidden-accessible" style="width:100%;" tabindex="-1" aria-hidden="true">
                <volist name="voucher_type_list" id="voucher_type">
                    <option value="{$voucher_type.id}">{$voucher_type.name}</option>
                </volist>
            </select>
        </div>
        <div class="form-group">
            <label for="profit_odds">代金券数量</label>
            <input type="text" style="ime-mode:disabled;" onpaste="return false;" onkeypress="keyPress()" class="form-control" name="voucher_num" id="voucher_num" value="2" placeholder="代金券数量">
        </div>
        <div class="form-group">
            <label for="day_num">有效天数</label>
            <input type="text" style="ime-mode:disabled;" onpaste="return false;" onkeypress="keyPress()" class="form-control" name="day_num" id="day_num" value="3" placeholder="有效天数">
        </div>
    </form>
</div>

<script>
    $(function () {
        $(".select2").select2({minimumResultsForSearch: Infinity});
        $("#use_voucher").on('switchChange.bootstrapSwitch', function(event, state) {
            var use_voucher = 1;
            var info = '代金劵已启用';
            if (state == true) {
                use_voucher = 1;
                info = '代金劵已启用';
                $("#voucher_use_money").removeAttr("disabled");
                $("#voucher_use_money_txt").css("color", "#333333");
                $("#max_use_voucher_count").removeAttr("disabled");
                $("#max_use_voucher_count_txt").css("color", "#333333");
                // data-toggle="tab"
            } else {
                use_voucher = 2;
                info = '代金劵已停用';
                $("#voucher_use_money").attr("disabled", true);
                $("#voucher_use_money_txt").css("color", "#a7a7a7");
                $("#max_use_voucher_count").attr("disabled", true);
                $("#max_use_voucher_count_txt").css("color", "#a7a7a7");
            }

            $.ajax({
                type:"POST",
                url : '__ADMIN__/'+moduleName+'/setting',
                dataType:"json",
                data:{
                    id:1,
                    use_voucher:use_voucher
                },
                beforeSend:showLoad,
                success:function(msg) {
                    if (msg.code == 0)
                        $.scojs_message(info, $.scojs_message.TYPE_OK);
                    else
                        $.scojs_message('代金劵启用&停用失败', $.scojs_message.TYPE_ERROR);
                    hideLoad();
                }
            });

        });

        $("#is_send_voucher").on('switchChange.bootstrapSwitch', function(event, state) {
            var is_send_voucher = 1;
            var info = '开启新用户注册赠送代金劵功能';
            if (state == true) {
                is_send_voucher = 1;
                info = '开启新用户注册赠送代金劵功能';
                $("#djj_tab").css({cursor:"pointer",color:"#444444"}).attr({href:"#setting_5_2", "data-toggle":"tab"});
            } else {
                is_send_voucher = 2;
                info = '关闭新用户注册赠送代金劵功能';
                $("#djj_tab").css({cursor:"no-drop",color:"#a7a7a7"}).attr({href:"javascript:void(0)"}).removeAttr("data-toggle");
            }
            $.ajax({
                type:"POST",
                url : '__ADMIN__/'+moduleName+'/setting',
                dataType:"json",
                data:{
                    id:1,
                    is_send_voucher:is_send_voucher
                },
                beforeSend:showLoad,
                success:function(msg) {
                    if (msg.code == 0)
                        $.scojs_message(info, $.scojs_message.TYPE_OK);
                    else
                        $.scojs_message('新用户注册赠送代金劵开启&关闭失败', $.scojs_message.TYPE_ERROR);
                    hideLoad();
                }
            });
        });

        $("#djj_tab").on("click", function () {
            if($(this).attr("data-toggle")) {
                loadVoucherData()
            }
        });
        $("#fl_djj_tab").on("click", function () {
            if($(this).attr("data-toggle")) {
                loadVoucherData()
            }
        });
        $("#daer_djj_setting_btn").on("click", function () {
            open_voucher_win_from("添加配置", 0, "", "", "", "", "")
        });
    });

    //加载数据
    function loadVoucherData() {
        showLoad();
        $.ajax({
            type : "post",
            url : '__ADMIN__/userVoucher/tolist',
            dataType:"json",
            data: {
                page_num : $('#page_num_voucher_config').val()
                ,page_size : $('#page_size_voucher_config').val()
                //多条件查询在此添加提交数据
            },
            success : function(msg) {
                showVoucherData(msg);
                paging_handler(msg, "paging_voucher", "info_voucher_data", "showVoucherPage");
                hideLoad();
            }
        });
    }

    //根据页码显示数据
    function showVoucherPage(pageNum) {
        $('#page_num_voucher_config').val(pageNum);
        loadVoucherData();
    }

    //数据拼装
    function showVoucherData(msg) {
        var content = '';
        //datatable head
        content += '<tr>';
        content += '<th style="width:35px;">#</th>';
        content += '<th>代金券使用范围</th>';
        content += '<th>代金券面额</th>';
        content += '<th>代金券类型</th>';
        content += '<th>代金券数量</th>';
        content += '<th>有效天数</th>';
        content += '<th style="width:130px;">操作</th>';
        content += '</tr>';

        //datatable data
        for (var i = 0; i < msg.list.length; i++) {
            var voucher_range = "全场";
            if (null != msg.list[i].voucher_range && msg.list[i].voucher_range != "") {
                voucher_range = msg.list[i].voucher_range;
            }
            content += '<tr>';
            content += '<td>' + (i+1) + '</td>';
            content += '<td>' + voucher_range + '</td>';
            content += '<td>' + msg.list[i].money + '</td>';
            content += '<td>' + msg.list[i].type + '</td>';
            content += '<td>' + msg.list[i].voucher_num + '</td>';
            content += '<td>' + msg.list[i].day_num + '</td>';
            content += '<td>';
            content += '<span class="label label-primary" style="cursor:pointer;margin-right:3px;" onclick="edit_voucher_data(' + msg.list[i].id + ');">修改</span>';
            content += '<span class="label label-warning" style="cursor:pointer;margin-right:3px;" onclick="delete_voucher_data(this,' + msg.list[i].id + ');">删除</span>';
            content += '</td>';
            content += '</tr>';
        }
        $('#row_djj_data').html(content);
    }

    function delete_voucher_data(obj, id) {
        //询问框
        layer.confirm('您确认要删除该数据吗？', {
            btn: ['确认','取消'] //按钮
        }, function(index){
            showLoad();
            $.ajax({
                type : "post",
                url : '__ADMIN__/userVoucher/delete',
                dataType:"json",
                data: {
                    id : id
                },
                success : function(msg) {
                    //alert(msg.code);
                    if (msg.code == 0) {
                        $(obj).parent().parent().fadeOut("slow");
                        //layer.msg('删除成功');
                        $.scojs_message('删除成功', $.scojs_message.TYPE_OK);
                    } else {
                        //layer.msg('删除失败');
                        $.scojs_message('删除失败', $.scojs_message.TYPE_ERROR);
                    }
                    hideLoad();
                }
            });

            layer.close(index);
        }, function(){
        });
    }

    function edit_voucher_data(id) {
        $.ajax({
            type : "post",
            url : '__ADMIN__/userVoucher/get_data',
            dataType:"json",
            data: {
                id : id
            },
            success : function(msg) {
                open_voucher_win_from("修改配置", msg.data.id, msg.data.voucher_range,msg.data.money,msg.data.type,msg.data.voucher_num,msg.data.day_num);
            }
        });
    }

    function open_voucher_win_from(title, id, voucher_range, money, type, voucher_num, day_num) {
        var load = null;
        layer.open({
            type: 1,
            anim:3,
            title: title,
            area: '500px',
            content: $("#win_voucher_temp"),
            btn: ['保存'],
            success: function () {
                var voucher_range_arr = [];
                if (null != voucher_range && voucher_range != "" && voucher_range != 0) {
                    voucher_range_arr = voucher_range.split(',');
                } else if (id > 0) {
                    $("#voucher_range option").each(function (){
                        voucher_range_arr.push($(this).attr("value"));
                    });
                }
                $("#voucher_range").val(voucher_range_arr).trigger('change');

                $("#id").val(id);
                $("#money").val(money);
                $("#type").val(type);
                $("#voucher_num").val(voucher_num);
                $("#day_num").val(day_num);

            },
            yes: function(index, layero){
                //按钮【按钮一】的回调
                var d = {};
                var t = $('#daer_voucher_from').serializeArray();
                $.each(t, function() {
                    d[this.name] = this.value;
                });
                if (null != $("#voucher_range").val() && "" != $("#voucher_range").val()) {
                    d["voucher_range"] = $("#voucher_range").val();
                }
                $.ajax({
                    type:"POST",
                    url : '__ADMIN__/userVoucher/addoreditbigtradeconfig',
                    dataType:"json",
                    data:d,
                    beforeSend:function () {
                        load = layer.load();
                    },
                    success:function(msg) {
                        loadVoucherData();
                        layer.close(load);
                        layer.alert(msg.msg);
                        if (msg.code == 0)
                            layer.close(index);
                    }
                });
            },
            cancel: function(index, layero){
                $("#voucher_range option").each(function (){
                    $(this).removeAttr("selected");
                });
            }
        });
    }
    
    function edit_voucher_type_data(id) {
        $.ajax({
            type : "post",
            url : '__ADMIN__/voucherType/get_data',
            dataType:"json",
            data: {
                id : id
            },
            success : function(msg) {
                var html = '<form id="daer_voucher_type_from" onsubmit="return false">';
                html += '<input type="hidden" name="id" id="id" value="'+id+'">';
                html += '<div class="form-group">';
                html += '<label for="start_price">代金劵类型名称</label>';
                html += '<input type="text" class="form-control" name="name" id="name" value="'+msg.data.name+'" placeholder="代金劵类型名称">';
                html += '</div>';
                html += '<div class="form-group">';
                html += '<label>代金券使用类型</label>';
                // html += '<input type="text" class="form-control" name="money" id="money" value="'+msg.data.type+'" placeholder="代金券使用类型">';
                var direct_use = '';
                var condition_use = '';
                var use_money_use = '';
                if (msg.data.type == 1) {
                    direct_use = 'checked';
                    use_money_use = 'disabled';
                } else if (msg.data.type == 2) {
                    condition_use = 'checked';
                }
                html += '<div class="input-group">';
                html += '<div class="radio"> <label for="direct_use"><input type="radio" id="direct_use" value="1" name="type" '+direct_use+'>直接使用</label></div>';
                html += '<div class="radio"> ';
                html += '<label for="condition_use"><input type="radio" id="condition_use" value="2" name="type" style="float:left;display:block;margin-top:10px;" '+condition_use+'>';
                html += '<span style="float:left;line-height:33px">单注金额达到</span>';
                html += '<input type="text" style="float:left;width:30%;margin-left:10px;margin-right:10px;" '+use_money_use+' class="form-control" name="use_money" id="use_money" value="'+msg.data.use_money+'" placeholder="代金劵类型名称">';
                html += '<span style="float:left;line-height:33px">元才能使用</span></label>';
                html += '</div>';
                html += '</div>';
                html += '</div>';
                html += '</form>';
                var load = null;
                layer.open({
                    anim:3,
                    title: "修改代金劵",
                    area: '500px',
                    content: html,
                    btn: ['保存'],
                    success:function () {
                        $(":radio").click(function(){
                            if ($(this).val() == 1) {
                                $("#use_money").attr("disabled", true);
                            } else {
                                $("#use_money").removeAttr("disabled");
                            }
                        });
                    },
                    yes: function(index, layero){
                        //按钮【按钮一】的回调
                        var d = {};
                        var t = $('#daer_voucher_type_from').serializeArray();
                        $.each(t, function() {
                            d[this.name] = this.value;
                        });
                        $.ajax({
                            type:"POST",
                            url : '__ADMIN__/voucherType/addoreditbigtradeconfig',
                            dataType:"json",
                            data:d,
                            beforeSend:function () {
                                load = layer.load();
                            },
                            success:function(msg) {
                                layer.close(load);
                                layer.alert(msg.msg);
                                if (msg.code == 0)
                                    layer.close(index);
                            }
                        });
                    }
                });

                // open_voucher_win_from("修改配置", msg.data.id, msg.data.voucher_range,msg.data.money,msg.data.type,msg.data.voucher_num,msg.data.day_num);
            }
        });
    }

    function sub_setting_5(){
        var voucher_use_money = $("#voucher_use_money").val();
        if (voucher_use_money ==  "") {
            $.scojs_message("代金券使用金额不能为空", $.scojs_message.TYPE_ERROR);
            return false;
        }
        var max_use_voucher_count = $("#max_use_voucher_count").val();
        if (max_use_voucher_count ==  "") {
            $.scojs_message("免费使用代金券次数不能为空", $.scojs_message.TYPE_ERROR);
            return false;
        }
        $.ajax({
            type:"POST",
            url : '__ADMIN__/'+moduleName+'/setting',
            dataType:"json",
            data:{
                id:1,
                voucher_use_money:voucher_use_money,
                max_use_voucher_count:max_use_voucher_count
            },
            beforeSend:showLoad,
            success:function(msg) {
                if (msg.code == 0)
                    $.scojs_message(msg.msg, $.scojs_message.TYPE_OK);
                else
                    $.scojs_message(msg.msg, $.scojs_message.TYPE_ERROR);
                hideLoad();
            }
        });

        return false;
    }

    function keyPress() {
        var keyCode = event.keyCode;
        if ((keyCode >= 48 && keyCode <= 57)) {
            event.returnValue = true;
        } else {
            event.returnValue = false;
        }
    }
</script>